<!DOCTYPE html>
<html lang="@@{website_lang}" dir="@@{website_dirLTR}">
<head>
	<meta charset="@@{website_charset}" />
	<title>Ribbon - @@{website_title}</title>	
	@@include('./src/components/_global/include-header.html')
</head>  

     
  <body class="page">
  
  
          
    @@include('./src/components/_global/include-loader.html')
    @@include('./src/components/_global/include-toggle-trigger.html')
    
    

  
  
    <div class="uix-wrapper">
    
        <!-- Header Area
        ============================================= -->      
        <header class="uix-header__container">
            
             <div class="uix-header">
                 <div class="container">
                 
                        @@include('./src/components/_global/include-brand.html')
                        
                        @@include('./src/components/_global/include-menu.html')
                        
                        
                        
                        
                  </div>
                  <!-- .container end -->
                  
                  <div class="uix-clearfix"></div>
             </div>
        
        </header>
        <div class="uix-header__placeholder js-uix-header__placeholder-autoheight"></div>
      
		<main id="uix-maincontent">
			
			<!-- Content 
			====================================================== -->
			<section class="uix-spacing--s uix-spacing--no-bottom">
				<div class="container">
					<div class="row">
						<div class="col-12">
							<h3>Ribbon</h3>
							<p>Ribbons can be used when you want to display something important or eye catching to the user, such as, if you would like to show something is popular or new to your website.</p>
							<hr>
							
							
						</div>
					</div>
					<!-- .row end -->

				</div>
				<!-- .container end -->

			</section>
			
		


		   <!-- Content 
			====================================================== -->
			<section class="uix-spacing--s uix-spacing--no-bottom">
				<div class="container">

						<div class="row">
							<div class="col-12">
								
								<div class="uix-relative" style="background: #F5F5F5; height: 100px;">
									<div class="uix-ribbon--triangle uix-ribbon--triangle--style-1">
										<div><i class="fa fa-cogs"></i></div>
									</div>	
								</div>



							</div>
						</div>
						<!-- .row end -->


				</div>
				<!-- .container end -->


			</section>


			<section class="uix-spacing--s uix-spacing--no-bottom">
				<div class="container">

						<div class="row">
							<div class="col-12">
								
								<div class="uix-relative" style="background: #F5F5F5; height: 100px;">
									<div class="uix-ribbon--triangle uix-ribbon--triangle--style-1 uix-ribbon--triangle--left">
										<div><i class="fa fa-cogs"></i></div>
									</div>
								</div>

									

							</div>
						</div>
						<!-- .row end -->


				</div>
				<!-- .container end -->


			</section>

			<section class="uix-spacing--s uix-spacing--no-bottom">
				<div class="container">


						<div class="row">
							<div class="col-12">
								
								<div class="uix-relative" style="background: #F5F5F5; height: 100px;">
									<div class="uix-ribbon--triangle uix-ribbon--triangle--style-2">
										<div><i class="fa fa-cogs"></i></div>
									</div>
								</div>

									

							</div>
						</div>
						<!-- .row end -->



				</div>
				<!-- .container end -->


			</section>


			<section class="uix-spacing--s uix-spacing--no-bottom">
				<div class="container">


						<div class="row">
							<div class="col-12">
								
								<div class="uix-relative" style="background: #F5F5F5; height: 100px;">
									<div class="uix-ribbon--triangle uix-ribbon--triangle--style-2 uix-ribbon--triangle--left">
										<div><i class="fa fa-cogs"></i></div>
									</div>
								</div>

									

							</div>
						</div>
						<!-- .row end -->



				</div>
				<!-- .container end -->


			</section>
			
		</main>
		
			
        
     
        @@include('./src/components/_global/include-copyright.html')
        
        
    </div>
    <!-- .uix-wrapper end -->
       
       
    @@include('./src/components/_global/include-footer.html')

